
<template>
  <base-page-view class-name="page-container">
    <view class="monthIncome-tab">
      <view v-for="(tab,index) in tabTit" :key="index" class="tab-item" :class="{active:active==index}" @click="toggle(index)">
        {{ tab }}
        <view v-if="active===index" class="borderBottom">
        </view>
      </view>
    </view>
    <view v-if="listData.length>0" class="content">
      <view class="headline">
        <view>{{ month.substring(0,4)+'年'+month.substring(4,6)+'月' }}</view>
        <view v-if="current>0">合计收益：￥{{ current | formatMoney }}</view>
      </view>
      <view v-for="(list,index) in listData" :key="index" class="list">
        <view v-for="(goods,index2) in list.goodsList" :key="index2" class="goods">
          <view class="title" :class="goods.reward>=0?'':'title_pri_del'">{{ goods.title }}</view>
          <view class="goodsRight" :class="goods.reward>=0?'':'title_pri_del'"><view class="num">*{{ goods.num }}</view> <view>¥{{ Math.abs(goods.reward) | formatMoney }}</view></view>
        </view>
        <view class="totalEarnings" :class="list.rewardTotal>=0?'':'title_pri_del'">总收益¥{{ Math.abs(list.rewardTotal) | formatMoney }}</view>
        <view class="c_border"></view>
        <view class="order">
          <!-- <view class="details">
            <view>订单编号：</view>
            <view>{{ list.orderNo }}</view>
          </view> -->
          <view class="details">
            <view>订单金额：</view>
            <view>¥{{ list.total | formatMoney }}</view>
          </view>
          <view class="details">
            <view>付款时间:</view>
            <view>{{ list.payTime }}</view>
          </view>
        </view>
      </view>
    </view>
    <view v-if="listData.length<1" class="empty_view">
      <image src="/static/images/commission/commission-empty.png" class="empty_img" />
      <view class="tit">暂无任何内容</view>
    </view>
  </base-page-view>
</template>

<script>
import './monthIncome.scss'
export default {
  components: {
  },
  data() {
    return {
      tabTit: ['收益明细', '退货退款'],
      active: 0,
      month: '',
      pageSize: 10,
      pageNo: 1,
      listData: [],
      current: '',
      nomore: false,
      id: ''
    }
  },
  created() {
  },
  onLoad(option) {
    this.id = option.id
    this.month = option.time
    this.getList()
  },
  onPullDownRefresh() {
    this.pageNo = 1
    this.listData = []
    this.nomore = false
    this.getList()
  },
  onReachBottom() {
    if (this.nomore) return
    this.pageNo += 1
    this.getList()
  },
  onShow() {
  },
  methods: {
    async getList() {
      this.current = ''
      const res = await this.$api.commissionApi.getBillDetails({
        userId: this.$store.state.userInfo.uid,
        pageSize: this.pageSize,
        pageNo: this.pageNo,
        withdrawId: this.id,
        withdrawType: this.active === 0 ? 1 : 2
      })
      if (res.code === '000000') {
        setTimeout(function() {
          uni.stopPullDownRefresh()
        }, 500)
        this.listData = this.listData.concat(res.data.orderList)
        this.current = res.data.current
      }
    },
    toggle(index) {
      this.active = index
      this.listData = []
      this.pageNo = 1
      this.getList()
    }
  }
}
</script>
